<template>
  <w-table
    :data="rows"
    :columns="columns"
    :is-paging="false"
    row-key="Id"
  />
</template>

<script>
import moment from 'moment'
export default {
  components: {
  },
  props: {
    table: {
      type: Object,
      default: null
    }
  },
  data() {
    return {
      columns: [],
      rows: [],
      colList: [],
      colAlign: {
        0: 'left',
        1: 'center',
        2: 'right'
      }
    }
  },
  computed: {
  },
  watch: {
    table: {
      handler(val) {
        if (val) {
          this.reset()
        }
      },
      immediate: true
    }
  },
  methods: {
    reset() {
      const cols = this.initChildren(this.table.Column)
      this.columns = cols
      this.$nextTick(this.loadRows)
    },
    initChildren(list) {
      if (list == null || list.length === 0) {
        return null
      }
      return list.map(c => {
        const col = {
          title: c.Label
        }
        if (c.Children == null || c.Children.length === 0) {
          col.align = this.colAlign[c.align]
          col.key = c.Name
          col.sortby = c.SortName == null ? c.Name : c.SortName
          if (c.Width) {
            col.minWidth = c.Width + 'px'
          }
          this.colList.push({
            Id: c.Id,
            Name: c.Name,
            DataType: c.DataType,
            ColSet: c.ColSet
          })
        } else {
          col.children = this.initChildren(c.Children)
        }
        return col
      })
    },
    loadRows() {
      if (this.table.Rows) {
        this.table.Rows.forEach(a => {
          this.formatRow(a)
        })
        this.rows = this.table.Rows
        console.log(this.rows)
      }
    },
    formatRow(row) {
      this.colList.forEach(c => {
        const val = row[c.Name]
        if (val == null) {
          return
        }
        if (c.DataType === 5) {
          if (val === true) {
            if (c.ColSet == null) {
              row[c.Name] = '是'
            } else {
              row[c.Name] = c.ColSet.ActiveText ? c.ColSet.ActiveText : '是'
            }
          } else {
            if (c.ColSet == null) {
              row[c.Name] = '否'
            } else {
              row[c.Name] = c.ColSet.InactiveText ? c.ColSet.InactiveText : '否'
            }
          }
        } else if (c.DataType === 3 || c.DataType === 6 || c.DataType === 9) {
          const format = c.ColSet ? c.ColSet['format'] : null
          if (format === 'time') {
            row[c.Name] = parseInt(val / 60) + ':' + (val % 60)
          } else if (format === 'ratio') {
            row[c.Name] = val + '%'
          }
        } else if (c.DataType === 7) {
          const format = c.ColSet ? c.ColSet['format'] : null
          if (format == null) {
            row[c.Name] = moment(val).format('YYYY-MM-DD HH:mm')
          } else {
            row[c.Name] = moment(val).format(format)
          }
        } else if (c.DataType === 8) {
          const format = c.ColSet ? c.ColSet['format'] : null
          if (format == null) {
            row[c.Name] = moment(val).format('YYYY-MM-DD')
          } else {
            row[c.Name] = moment(val).format(format)
          }
        }
      })
    }
  }
}
</script>

